.wrapper {
  display: flex;

  .selfInformation {
    flex: 2.5;
    margin-right: 50px;
    /*个人简介*/

    .information {
      height: 650px;
      margin: 10px 0px 10px 0px;
      background-color: #f8fafc;
      border-color: #e7e7e7;
      border: 1px solid transparent;
      border-radius: 4px;
      font-size: 14px;
      /*昵称*/

      p {
        width: 100px;
        display: block;
        margin: 10px auto;
        text-align: center;
      }

      /*信息列表*/

      ul {
        display: block;
        margin: 20px 20px 30px;
        border: none;
      }

      /*头像*/

      img {
        display: block;
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
      }
    }
  }

  .mainInformation {
    flex: 7;
    /*个人动态*/

    .things {
      width: 100%;
      margin: 10px 10px 10px 0px;

      .toptab {
        height: 58px;
        border-bottom: 1px solid #d4d5d7;
        padding-left: 0px;
        font-size: 16px;

        li {
          float: left;
          height: 58px;
          line-height: 59px;
          margin-right: 58px;

          a {
            color: #787d82;
            display: inline-block;

            &:hover {
              color: #CA0C16 !important;
            }
          }
        }

        .tabactive {
          border-bottom: 2px solid #CA0C16;

          a {
            color: #CA0C16 !important;
          }
        }
      }

      .content {
        padding: 10px;
        font-size: 16px;

        .blog {
          height: 25%;
          padding: 20px;
          border-bottom: 1px solid #dacece;
          margin-top: 5px;

          .blogTitle {
            color: #000;
          }

          .blogIcon {
            margin: 0 10px;
          }
        }

        /*收藏*/

        .collection {
          height: 50px;
          line-height: 50px;
          padding: 0 20px;
          border: 1px solid #ddd;
          border-radius: 4px;
          margin-top: 20px;
          /*收藏标题*/

          .collection_title {
            float: left;
            margin-bottom: 0;
            font-weight: normal;
          }

          .collectionIconWrapper {
            float: right;
            margin: 16px 0;
            width: 50px;
            font-size: 16px;
            color: #b9b9b0;
            display: flex;

            span {
              flex: 1;
            }
          }
        }

        /*我的资料*/
        /*领域-技能标题*/

        .skillTitle {
          margin: 10px 10px;
          color: #337ab7;
          /*教育经历-工作经历添加图标*/

          .glyphicon {
            float: right;
            color: #b9b9b0;
          }

          .onlySelf {
            font-size: 12px;
            color: #222;
          }
        }

        /*暂无教育经历-工作经历图标*/

        .glyphicon-th-list {
          color: #b9b9b0;
          text-align: center;
          display: block;
          margin: 5px 0;
        }

        /*领域-技能框图*/

        .field-skill {
          width: 100px;
          height: 30px;
          margin: 10px 10px;
          border: 1px dashed #ddd;
          border-radius: 4px;
          text-align: center;

          .glyphicon {
            margin: 6px 0;
            color: #b9b9b0;
          }
        }

        #contactMethod {
          width: 100%;
          margin-left: 15px;

          td {
            padding: 5px;

            &:nth-child(odd) {
              width: 15%;
            }

            &:nth-child(even) {
              color: #b9b9b0;
            }
          }
        }

        .attentionWrapper {
          display: flex;

          .nav-pills {
            flex: 7;
          }

          .input-group {
            flex: 3;
            margin-top: 8px;

            .btn-default {
              background-color: #eee;

              .glyphicon-search {
                color: #337ab7;
              }
            }
          }
        }
      }
    }
  }
}


